/*
* 气泡对话框容器
*
* topPosition：尖端位置
* reClass：覆盖样式类名
* isDanger:传入的内容是否包含html字符
* */

'use strict';
var React = require('react');
class ReBubbleBox extends React.Component {
    constructor(props) {
        super(props);
        this.getMainClassname=this.getMainClassname.bind(this);
    }


    getMainClassname(){
        if(this.props.reClass!=undefined){
            return "ReBubbleBox "+this.props.reClass;
        }
        else{
            return 'ReBubbleBox';
        }
    }

    createMarkup(content) {
        return {__html: content};
    };

    render(){
        var style;
        if(this.props.topPosition!=undefined){
            style={
                left:this.props.topPosition
            }
        }
        return  <div className={this.getMainClassname()}>
            <div className="Bot" style={this.props.topPosition!=undefined?style:{}}></div>
            <div className="Top"  style={this.props.topPosition!=undefined?style:{}}></div>
            {this.props.isDanger?<div className="Content" dangerouslySetInnerHTML ={this.createMarkup(this.props.children)}></div>:<div className="Content">{this.props.children}</div>}
        </div>
    }
}

ReBubbleBox.propTypes={
    reClass:React.PropTypes.string,
    topPosition:React.PropTypes.string,
    isDanger:React.PropTypes.bool
};

module.exports = ReBubbleBox;